<template>
  <div class="divBox relative">
    <el-row :gutter="20" style="min-height:500px; ">
      <el-col :span="5" >
        <el-card class="box-card" style="min-height:500px; ">
          <el-tree :data="treeData" :props="defaultProps" @node-click="treeClick"></el-tree>

        </el-card>
      </el-col>
      <el-col :span="16" >
        <el-card class="box-card" style="min-height:500px; ">

          <el-table
            v-loading="listLoading"
            :data="userTableData.data"
            style="width: 100%"
            size="mini"
            :highlight-current-row="true"
            :header-cell-style=" {fontWeight:'bold'}"
          >
            <el-table-column
              prop="personName"
              label="用户名称"
              width="180">
            </el-table-column>
            <el-table-column
              prop="deptSimpleName"
              label="部门名称"
              width="180">
            </el-table-column>
            <el-table-column
              prop="defaultDeptName"
              label="是否兼职"
              width="120">
            </el-table-column>
            <el-table-column
              prop="personNo"
              label="人员编号"
              width="100">
            </el-table-column>
            <el-table-column
              prop="sexName"
              label="性别"
              >
            </el-table-column>

            <el-table-column
              prop="phone"
              label="手机号码"
              width="120">
            </el-table-column>
            <el-table-column
              label="操作"
            >
              <template slot-scope="scope">
                <el-switch
                  v-model="scope.row.sendSms"
                  active-color="#13ce66"
                  @change="sendSmsUpdate(scope.row)"
                 >
                </el-switch>
              </template>
            </el-table-column>
          </el-table>
        </el-card>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import { dangerList, deptList, updateUser, userList,deptListTree } from '@/api/safe'

export default {
  name: 'SafeUser',
  data(){
    return{
      treeData:[],
      defaultProps: {
        children: 'children',
        label: 'label'
      },
      userTableData:{
        data:[]
      },
      listLoading:false,
      selectDept:{}
    }
  },
  mounted() {
    this.getDeptList()
  },
  methods:{

    getDeptList(){
      deptListTree("3302").then(res => {
        console.log(res)
        this.treeData=res
        this.treeClick(res)
      }).catch(res=>{
        this.$message.error(res.message);
      })
    },
    treeClick(row){
      this.selectDept=row
      userList(row.extend02).then(res=>{
        console.log(res)
        this.userTableData.data=res
      }).catch(res=>{
        this.$message.error(res.message);
      })
    },
    sendSmsUpdate(row){
      console.info(row)
      updateUser(row.sendSms,row.personId).then(res=>{
        console.log(res)
        this.$message.success("更新成功")
      }).catch(res=>{
        this.$message.error(res.message);
      })
    }
  }
}
</script>

<style scoped>

</style>
